# เจาะลึก Async Function ใน JavaScript วิธีจัดการ Promise ให้โค้ดอ่านง่ายและทรงพลัง

> การประกาศ async function คือการกำหนดฟังก์ชันแบบ asynchronous ใน JavaScript ซึ่งจะคืนค่าเป็น Promise โดยอัตโนมัติ ช่วยให้สามารถเขียนโค้ดแบบ non-blocking ได้อย่างมีประสิทธิภาพ

Full URL: https://www.topvery.com/blog/article.เจาะลึกAsyncFunctionในJavaScriptวิธีจัดการPromiseให้โค้ดอ่านง่ายและทรงพลัง.BLO251220205259.Dev Developer
Base URL: https://www.topvery.com/

---

## การประกาศ Async Function คืออะไร

การประกาศ **async function** เป็นการสร้างฟังก์ชันรูปแบบใหม่ใน JavaScript เพื่อทำงานในลักษณะ Asynchronous โดยฟังก์ชันที่ถูกประกาศด้วยคีย์เวิร์ดนี้จะคืนค่ากลับมาเป็น Promise เสมอ

ข้อดีหลักของการใช้ async function คือการอนุญาตให้เราใช้คีย์เวิร์ด await ภายในฟังก์ชันนั้นได้ ซึ่งช่วยให้การเขียนโค้ดที่ต้องรอผลลัพธ์ (เช่น การดึงข้อมูลจาก API) ดูเหมือนการเขียนโค้ดแบบ Synchronous ปกติ ทำให้อ่านและทำความเข้าใจได้ง่ายขึ้น

## ไวยากรณ์ (Syntax)

รูปแบบการประกาศ Syntax ของฟังก์ชันมีดังนี้:

async function name(param0) {
  statements
}
async function name(param0, param1) {
  statements
}
async function name(param0, param1, /* … ,*/ paramN) {
  statements
}
## รายละเอียดการทำงาน

เมื่อคุณเรียกใช้ function ที่เป็น async มันจะคืนค่าเป็น Promise ทันที หากฟังก์ชันนั้นมีการ return ค่าออกมาตามปกติ (Non-promise value) ค่าที่ได้นั้นจะถูกห่อหุ้ม (Wrapped) เข้าไปใน Promise ที่สถานะ resolved โดยอัตโนมัติ

ในทางกลับกัน หากมีการ throw exception ภายใน async function ค่า Promise ที่คืนกลับมาจะมีสถานะเป็น rejected พร้อมกับค่า error นั้น

## ตัวอย่างการใช้งาน

ตัวอย่างโค้ดด้านล่างแสดงให้เห็นถึงการใช้ async function เพื่อรอเวลาเป็นระยะเวลาหนึ่งก่อนที่จะทำงานต่อ:

function resolveAfter2Seconds() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  const result = await resolveAfter2Seconds();
  console.log(result);
  // Expected output: "resolved"
}

asyncCall();จากตัวอย่าง เมื่อเรียกใช้ asyncCall โปรแกรมจะแสดงคำว่า "calling" ก่อน จากนั้นจะรอเป็นเวลา 2 วินาทีด้วยคำสั่ง await ก่อนที่จะแสดงคำว่า "resolved" ซึ่งเป็นผลลัพธ์จากการทำงานของ Promise

## สรุป

การใช้ async function และ await ช่วยให้นักพัฒนา Web Development สามารถจัดการกับการทำงานแบบ Asynchronous ได้อย่างเป็นระเบียบ ลดความซับซ้อนของโค้ดแบบ Promise chain หรือ Callback hell แบบเดิมๆ